<template>
	<!--企业基本信息-->
	<view class="padding-bottom-lg">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="content">
				<view class="custom-title">{{title}}</view>
			</block>
		</cu-custom>
		<!-- <view class="progress1 padding-top-32">
			<view class="progress-circle-1">
				<view class="complate-content">
					<view class="uncomplate-content"></view>
				</view>
				<text class="progress-text">工商信息</text>
			</view>
			<view class="progress-line1"></view>
			<view class="progress-circle-gray">
				<text class="progress-circle-number">2</text>
				<text class="progress-text text-767879">联系信息</text>
			</view>
		</view> -->
		<view class="margin-32 padding-32 bg-white radius-48">
			<form @submit="toSubmit">
				<view class="basic-qy-name">{{type == 2?'政府/管理部门名称：':'企业/组织名称：'}}</view>
				<input class="basic-qy-input" :placeholder="type == 2?'请输入政府/管理部门名称':'请输入企业/组织名称'"
					v-model="company_name" name="input"></input>

				<view class="basic-update-title padding-top-32">
					{{type == 2?'组织机构代码证/登记证书复印件：':'《营业执照》副本复印件：'}}
				</view>
				<view @click="ChooseImage(1)" class="yyzz-content flex align-center justify-center">
					<view class="yyzz flex align-center justify-center"
						:style="{backgroundImage:`url(${zhizhao_url})`}">
						<view class="camera-content flex align-center justify-center">
							<image src="https://txr001.zthj.net/static/camera.png" class="camara-img"></image>
						</view>
					</view>
				</view>
				<view class="padding-top-32 update-info">
					注:1.请上传组织机构代码证/登记证书复印件，JPG或PNG
					<view class="padding-left">格式，大小不超过5MB，拍摄时确保内容完整,字体清</view>
					<view class="padding-left">晰,亮度均匀;</view>
					<view class="padding-left" v-if="type==1">2.营业执照信息必须与工商信息一致;</view>
					<view class="padding-left" v-if="type==1">3.营业执照必须加盖企业公章。</view>
					<view class="padding-left" v-if="type==2">2.组织机构代码证/登记证书复印件必须与工商信息一致;</view>
					<view class="padding-left" v-if="type==2">3.组织机构代码证/登记证书复印件必须加盖企业公章。</view>
				</view>

				<view class="basic-qy-name padding-top-48">统一社会信用代码：</view>
				<input class="basic-qy-input margin-top" v-model="taxpayer_Identification_number" placeholder="请输入代码"
					name="input"></input>

				<view class="basic-qy-name padding-top-48">注册地址：</view>
				<input class="basic-qy-input" placeholder="请输入注册地址" v-model="registered_address" name="input"></input>

				<view class="basic-qy-name padding-top-48">{{type=='2'?'政府/管理部门类型：':'所属行业：'}}</view>
				<radio-group class="block" @change="tradeChange">
					<view class="padding-top-lg padding-bottom" v-if="type==1">
						<view class="flex">
							<view class="flex-sub flex justify-start align-center">
								<radio value="1" :checked="trade==1" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">制造业</text>
							</view>
							<view class="flex-sub flex justify-start align-center">
								<radio value="2" :checked="trade==2" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">建筑行业</text>
							</view>
						</view>
						<view class="flex padding-top-40 align-start">
							<view class="flex-sub flex justify-start align-center">
								<radio value="3" :checked="trade==3" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">批发和零售业</text>
							</view>
							<view class="flex-sub flex justify-start align-start">
								<radio value="4" :checked="trade==4" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title margin-top-6">交通运输、仓储和邮政业</text>
							</view>
						</view>
						<view class="flex padding-top-40 align-start">
							<view class="flex-sub flex justify-start align-center">
								<radio value="5" :checked="trade==5" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">住宿和餐饮业</text>
							</view>
							<view class="flex-sub flex justify-start align-start">
								<radio value="6" :checked="trade==6" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title margin-top-6">信息传输、软件和信息技术服务业</text>
							</view>
						</view>
						<view class="flex padding-top-40 align-start">
							<view class="flex-sub flex justify-start align-center">
								<radio value="7" :checked="trade==7" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">金融业</text>
							</view>
							<view class="flex-sub flex justify-start align-center">
								<radio value="8" :checked="trade==8" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">租赁和商务服务业</text>
							</view>
						</view>
						<view class="flex padding-top-40 align-start">
							<view class="flex-sub flex justify-start align-start">
								<radio value="9" :checked="trade==9" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title margin-top-6">居民服务、修理和其他服务业</text>
							</view>
							<view class="flex-sub flex justify-start align-center">
								<radio value="10" :checked="trade==10" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">教育</text>
							</view>
						</view>
						<view class="flex padding-top-40">
							<view class="flex-sub flex justify-start align-start">
								<radio value="11" :checked="trade==11" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title margin-top-6">文化、体育和娱乐业</text>
							</view>
						</view>
						<view class="flex padding-top-40">
							<view class="flex-sub flex justify-start align-center">
								<radio value="12" :checked="trade==12" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">其他</text>
							</view>
						</view>
					</view>
					<view class="padding-top-lg padding-bottom" v-else>
						<view class="flex align-start">
							<view class="flex-sub flex justify-start align-center">
								<radio value="13" :checked="trade==13" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">机关</text>
							</view>
							<view class="flex-sub flex justify-start align-center">
								<radio value="14" :checked="trade==14" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">事业单位</text>
							</view>
						</view>
						<view class="flex padding-top-40 align-start">
							<view class="flex-sub flex justify-start align-start">
								<radio value="15" :checked="trade==15" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title margin-top-6">社会团体（协会等）</text>
							</view>
							<view class="flex-sub flex justify-start align-center">
								<radio value="12" :checked="trade==12" style="transform:scale(0.8)"></radio>
								<text class="basic-radio-title">其他</text>
							</view>
						</view>

					</view>
					<input v-if="trade==12" class="basic-qy-input margin-top" :disabled="trade_status"
						v-model="trade_notes" placeholder="请输入所属行业" name="input"></input>
				</radio-group>

				<view class="basic-qy-name padding-top-48">所在地区：</view>
				<view class="basic-qy-input" style="line-height: 80rpx;">
					<pickers @address="changeAddress" @close="close">
						<text class="add-text text-black" v-if="!province">选择省、市、区、街道</text>
						<text class="add-text text-black" v-else>{{ province }}-{{ city }}-{{ area }}</text>
						<text class="cuIcon-right" style="position: absolute;right:12%;"></text>
					</pickers>
				</view>
				<view class="basic-qy-name padding-top-48">详细地址：</view>
				<input class="basic-qy-input" placeholder="请输入真实详细地址" v-model="business_address" name="input"></input>

				<view class="basic-update-title padding-top-48 flex justify-between align-center">
					<view class="text-bold">委托授权书（盖章）：</view>
					<view @click="fileDown">
						<image src="https://txr001.zthj.net/static/khxz.png" class="basic-title-img"></image>
						<text class="wtsqs-class" style="color: #274890;">委托授权书</text>
					</view>
				</view>
				<view @click="ChooseImage(3)" class="yyzz-content flex align-center justify-center">
					<view class="sqs flex align-center justify-center"
						:style="{backgroundImage:`url(${shouquan_url})`}">
						<view class="camera-content flex align-center justify-center">
							<image src="https://txr001.zthj.net/static/camera.png" class="camara-img"></image>
						</view>
					</view>
				</view>
				<view class="padding-top-32 update-info">
					注:1.请下载委托授权书根据要求填写然后加盖企业公章
					<view class="padding-left">2.JPG或PNG格式，大小不超过5MB，拍摄时确保内容完整,字体清晰,亮度均匀；</view>
				</view>

				<view class="basic-qy-name padding-top-48">{{type=='2'?'负责人/代表手机：':'负责人/代表手机：'}}</view>
				<input class="basic-qy-input margin-top" v-model="mobile" placeholder="请输入手机号"></input>

				<view class="basic-qy-name padding-top-48">{{type=='2'?'负责人/代表邮箱：':'负责人/代表邮箱：'}}</view>
				<input class="basic-qy-input" v-model="email" placeholder="请输入邮箱"></input>

				<view class="basic-qy-name padding-top-48">{{type=='2'?'政府/管理部门LOGO：':'企业LOGO：'}}</view>
				<view class="file-up-content margin-top-12" @click="ChooseImage(2)">
					<image :src="logo" class="img-80"></image>
				</view>
				<view class="padding-top-32 update-info">
					注:1.JPG或PNG格式，大小不超过5MB，
					<view class="padding-left">2.建议尺寸:200*200</view>
					<view class="padding-left">3.若无可使用头像图片临时代替，后期替换。</view>
				</view>
				<view class="padding flex align-center justify-center">
					<button class="cu-btn round submit-btn" form-type="submit">提交申请</button>
				</view>
			</form>
		</view>
	</view>
</template>

<script>
	import pickers from "./../../../components/ming-picker/ming-picker.vue"
	export default {
		components: {
			pickers
		},
		data() {
			return {
				company_name: '',
				// leader: '',
				taxpayer_Identification_number: '',
				trade: null,
				trade_notes: '',
				registered_address: '',
				business_address: '',
				mobile: '',
				email: '',
				// type: 1,
				trade_status: true,
				id: 0,
				// isUpdate: false,
				zhizhao_url: 'https://txr001.zthj.net/static/yyzz.png',
				shouquan_url: 'https://txr001.zthj.net/static/sqs.png',
				type: 1,
				title: "企业/组织信息",
				province: "",
				city: "",
				area: "",
				logo: 'https://txr001.zthj.net/static/img/fileUpload.png',
			}
		},
		onLoad(e) {
			if (e.type) {
				this.type = e.type;
			}
			if (this.type == 2) {
				this.title = "政府/管理部门信息";
					// this.trade = 13;
			}
			this.getInfo();

		},
		methods: {
			changeAddress(e) {
				this.province = e.value[0]
				this.city = e.value[1]
				this.area = e.value[2]
			},
			postImg(imgFilePaths, type) {
				uni.uploadFile({
					url: 'https://qd.zthj.net/api/Common/upload',
					filePath: imgFilePaths,
					name: 'file',
					success: (res) => {
						let info = JSON.parse(res.data)
						// console.log(res.data);
						if (type == 1) {
							this.zhizhao_url = info.data.fullurl;
						} else if (type == 3) {
							this.shouquan_url = info.data.fullurl;
						} else {
							this.logo = info.data.fullurl;
						}
						// else {
						// 	this.shouquan_url = info.data.fullurl;
						// }
					}
				});
			},
			fileDown() {
				var that = this
				//加载框动画
				uni.showLoading({
					title: '正在下载……'
				});
				uni.downloadFile({
					url: 'https://txr001.zthj.net/jcxxtb/%E9%9D%92%E7%89%92%E7%A2%B3%E8%B4%A6%E6%88%B7%E4%BB%A3%E8%A1%A8%E6%8E%88%E6%9D%83%E5%A7%94%E6%89%98%E4%B9%A6.pdf',
					success: (data) => {
						console.log('打印data', data)
						if (data.statusCode === 200) {
							//隐藏加载框
							uni.hideLoading();
							//文件保存到本地
							uni.getFileSystemManager().saveFile({
								tempFilePath: data.tempFilePath, //临时路径
								success: function(res) {
									console.log('打印res',res)
									uni.showToast({
										icon: 'success',
										mask: true,
										// title: '文件已保存：' + res.savedFilePath, //保存路径
										title: '下载成功',
										duration: 2000,
									});
									//自动打开文档查看
									setTimeout(() => {
										var filePath = res.savedFilePath;
										uni.openDocument({ //新开页面打开文档，支持格式：doc, xls, ppt, pdf, docx, xlsx, pptx。
											filePath: filePath,
											showMenu: true,
											success: function(res) {
												console.log('打开文档成功');
											}
										});
									}, 2000)
								}
							});
						}
					},
					fail: (err) => {
						console.log(err);
						uni.showToast({
							icon: 'none',
							mask: true,
							title: '文件下载失败',
						});
					},
				});
			},
			ChooseImage(type) {
				let that = this;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: (res) => {
						// console.log();
						that.postImg(res.tempFilePaths[0], type)
					}
				});
			},
			async toSubmit() {
				if (!this.company_name) {
					uni.showToast({
						title: '请输入企业名称',
						icon: 'none'
					})
					return
				}
				if (this.trade == 12 && !this.trade_notes) {
					uni.showToast({
						title: '请输入所属行业',
						icon: 'none'
					})
					return
				}
				if (!this.taxpayer_Identification_number) {
					uni.showToast({
						title: '请输入组织机构代码或统一社会信用代码',
						icon: 'none'
					})
					return
				}
				if (!this.registered_address) {
					uni.showToast({
						title: '请输入注册地址',
						icon: 'none'
					})
					return
				}
				if (!this.trade) {
					uni.showToast({
						title: '请选择所属行业',
						icon: 'none'
					})
					return
				}
				if (!this.area) {
					uni.showToast({
						title: '请输入所在地区',
						icon: 'none'
					})
					return
				}
				if (!this.business_address) {
					uni.showToast({
						title: '请输入真实详细地址',
						icon: 'none'
					})
					return
				}
				if (!this.zhizhao_url || this.zhizhao_url == 'https://txr001.zthj.net/static/yyzz.png') {
					if (this.type == 2) {
						uni.showToast({
							title: '请上传组织机构代码证/登记证书复印件',
							icon: 'none'
						})
					} else {
						uni.showToast({
							title: '请上传组织机构代码证/登记证书复印件',
							icon: 'none'
						})
					}

					return
				}
				if (!this.shouquan_url || this.shouquan_url == 'https://txr001.zthj.net/static/sqs.png') {
					uni.showToast({
						title: '请上传委托授权书',
						icon: 'none'
					})
					return
				}

				let mobilereg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/
				if (!this.mobile) {
					uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					})
					return
				} else if (!mobilereg.test(this.mobile)) {
					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					})
					return
				}
				let email_reg = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;
				if (!this.email) {
					uni.showToast({
						title: '请输入邮箱',
						icon: 'none'
					})
					return
				} else if (!email_reg.test(this.email)) {
					uni.showToast({
						title: '请输入正确的邮箱',
						icon: 'none'
					})
					return
				}
				let params = {
					company_name: this.company_name,
					taxpayer_Identification_number: this.taxpayer_Identification_number,
					trade: this.trade,
					trade_notes: this.trade_notes,
					registered_address: this.registered_address,
					business_address: this.business_address,
					zhizhao_url: this.zhizhao_url,
					shouquan_url: this.shouquan_url,
					logo: this.logo,
					type: this.type,
					id: this.id
				};
				// let url = "https://qd.zthj.net/api/userinfo/addBasic";
				let res;
				if (this.id == 0) {
					res = await this.$api.addBasic(params);
				} else {
					res = await this.$api.updateBasic(params);
					// url = "https://qd.zthj.net/api/userinfo/updateBasic";
				}
				if (res.code == 1) {
					this.id = res.data.renzheng_id;
					// uni.navigateTo({
					// 	url: "/subpackage/pages/mine/company/concactInfo?id=" + this.id
					// })
					uni.showToast({
						title: '提交成功！',
						icon: 'none'
					});
					setTimeout(() => {
						uni.navigateBack();
						// if (this.id == 0) {
						// 	setTimeout(() => {
						// 		uni.hideToast();
						// 		//关闭提示后跳转
						// 		uni.navigateTo({
						// 			url: "/pages/mine/company/concactInfo?id=" + this.id
						// 		})
						// 	}, 1500)

						// }
					}, 1500);
				} else {
					uni.showToast({
						title: '该企业您已提交过相关信息！',
						icon: 'none'
					})
				}


			},
			tradeChange(e) {
				if (e.detail.value == 12) {
					this.trade_status = false;
				} else {
					this.trade_status = true;
				}
				this.trade = e.detail.value;
			},
			// jigouChange(e) {
			// 	this.org_type = e.detail.value;
			// },
			getInfo: async function(id) {
				let res = await this.$api.basicdetail();
				console.log("这里都没有来", res)
				if (res) {
					this.company_name = res.company_name;
					this.trade = res.trade;
					this.trade_notes = res.trade_notes;
					this.taxpayer_Identification_number = res.taxpayer_Identification_number;
					this.registered_address = res.registered_address;
					this.business_address = res.business_address;
					this.zhizhao_url = res.zhizhao_url;
					this.type = res.type;
					this.shouquan_url = res.shouquan_url ? res.shouquan_url : "https://txr001.zthj.net/static/sqs.png";
					this.logo = res.logo ? res.logo : "https://txr001.zthj.net/static/img/fileUpload.png";
					console.log("这里都没有来")
					this.id = res.id;
				}

			}


		}
	}
</script>
<style scoped>
	.uni-radio-input {
		background: #24458E !important;
		border-color: #24458E !important;
	}

	.uni-radio-input-checked {
		background: #24458E !important;
		border-color: #24458E !important;
	}

	input {
		color: black;
	}

	.progress-line1 {
		width: 286rpx !important;
	}

	.wtsqs-class {
		color: #274890;
		border-bottom: 2rpx solid #274890;
	}
</style>